<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <title>{$title}</title>
  <link rel="shortcut icon" href="__PUBLIC__/favicon.ico">
  <link rel="stylesheet" href="__PUBLIC__/layui/css/layui.css">
  <link rel="stylesheet" href="__PUBLIC__/style/admin.css">
</head>
<body>
  <ul class="layui-nav nav fixed-nav layui-bg-cyan" lay-filter="">
    <li class="layui-nav-item"><a href="#" id="scan-log">查看结果</a></li>
    <li class="layui-nav-item"><a href="#" id="list-finger">指纹库</a></li>
    <li class="layui-nav-item"><a href="#" id="add-finger">添加指纹</a></li>
    <li class="layui-nav-item">
      <a href="javascript:;">{$username}</a>
      <dl class="layui-nav-child">
        <dd><a href="#" id="repass">修改密码</a></dd>
        <dd><a href="/User/Index/logout">退出登录</a></dd>
      </dl>
    </li>
  </ul>
  <div class="layui-row admin-row">
    <div class="layui-col-xs10 layui-col-sm8 layui-col-md6 layui-col-lg6">
      <div class="form-card">
        <h1>{$title}</h1>
        <div class="layui-form">
          <div class="layui-inline form-input">
            <input type="text" name="target" required  lay-verify="required" placeholder="请输入URL地址，例如http://www.google.com" autocomplete="off" class="layui-input">
          </div>
          <div class="layui-inline">
            <button class="layui-btn" lay-submit lay-filter="scan-submit"><i class="layui-icon">&#xe615;</i> 扫描</button>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="layui-row admin-row" style="display: none; padding-bottom: 100px;" id="scan-result">
    <div class="layui-col-xs10 layui-col-sm8 layui-col-md6 layui-col-lg6">
      
      <fieldset class="layui-elem-field layui-field-title site-title" style="border-color: #FF5722">
        <legend style="color: white; font-size: 18px;"> 请求响应头</legend>
      </fieldset>
      <table id="headerTb" lay-filter="headerTb"></table>

      <fieldset class="layui-elem-field layui-field-title site-title" style="border-color: #FF5722; margin-top: 40px;">
        <legend style="color: white; font-size: 18px;">指纹识别结果</legend>
      </fieldset>
      <table id="fingerTb" lay-filter="fingerTb"></table>
    </div>
  </div>
<script src="__PUBLIC__/layui/layui.js"></script>
<script type="text/html" id="actionTpl">
  <a href="#" class="layui-table-link" onclick="finger_detail('{{d.id}}')">{{d.app_name}}</a>
</script>
<script>
layui.use(['layer', 'form','element', 'table'], function(){
  var layer = layui.layer
  ,$ = layui.$
  ,element = layui.element
  ,form = layui.form
  ,table = layui.table;
  
  element.render();

  //提交
  form.on('submit(scan-submit)', function(obj){
    layer.load(1, {shade: [0.8, '#000']});
    $.ajax({
        url: '/Home/Ajax/ajax_scan',
        type: 'POST',
        contentType: 'application/json',
        data: JSON.stringify(obj.field),
        timeout: 0,
        success: function(d) {
          if(d.error == 0){
            $("#scan-result").show();

            table.render({
              elem: '#headerTb',
              cols:  [[{field: 'name', title: '字段'}, {field: 'value', title: '值'}]],
              data: d.data.header
            });

            table.render({
              elem: '#fingerTb',
              cols:  [[{field: 'app_name', title: '应用名称', templet: '#actionTpl'}, {field: 'app_version', title: '应用版本'}, {field: 'app_script', title: '应用脚本', width:100}]],
              data: d.data.finger
            });
          }else{
            layer.msg(d.msg);
          }
          layer.closeAll('loading');
        },
        error: function(xhr, status, error) {
          layer.msg("请求出错：\n" + xhr.status + "\n" + status + "\n" + error);
          layer.closeAll('loading');
        }
    }).always(function() {
      layer.closeAll('loading');
    });
    
  });

  $('#add-finger').click(function(event) {
        event.preventDefault(); // 阻止默认行为
        layer.open({
          type: 2,
          area: ['80%', '90%'],
          fixed: false,
          maxmin: true,
          title: '添加指纹',
          content: '/Home/Index/add_finger'
        });
    });

  $('#list-finger').click(function(event) {
        event.preventDefault(); // 阻止默认行为
        layer.open({
          type: 2,
          area: ['80%', '90%'],
          fixed: false,
          maxmin: true,
          title: '指纹库',
          content: '/Home/Index/list_finger'
        });
    });
  $('#repass').click(function(event) {
        event.preventDefault(); // 阻止默认行为
        layer.open({
          type: 2,
          area: ['460px', '260px'],
          fixed: false,
          maxmin: true,
          title: '修改密码',
          content: '/User/Index/repass'
        });
    });
  $('#scan-log').click(function(event) {
        event.preventDefault(); // 阻止默认行为
        layer.open({
          type: 2,
          area: ['80%', '90%'],
          fixed: false,
          maxmin: true,
          title: '检测结果',
          content: '/Home/Index/scan_log'
        });
    });
});

function finger_detail(id){
  event.preventDefault(); // 阻止默认行为
  layer.open({
    type: 2,
    area: ['80%', '90%'],
    fixed: false,
    maxmin: true,
    title: '指纹详情',
    content: '/Home/Index/finger_detail?id='+id
  });
}
</script> 
</body>
</html>